<!-- Modal Dialog to set parameters for specific Jobs -->
<div id="launchJobDialogModal" class="modal-dialog-container">
  <div class="modal-dialog">
  <div class="modal-dialog-header">
    <h1>Launch {{jobclass}}</h1>
  </div>
  <div class="modal-dialog-content">
    <div class="form-group">
      {{jobclass}} Options
    </div>

    <div *ngFor="let option of options; trackBy:trackByName">

      <div class="form-group" *ngIf="option.type=='select'">
        {{option.desc}}: <select [(ngModel)]="option.value">
          <option *ngFor="let val of option.values" value="{{val}}">{{val}}</option>
          <option *ngFor="let val of option.values_ex" value="{{val.value}}">{{val.name}}</option>
        </select>
      </div>

      <div class="form-group" *ngIf="option.type=='text'">
        {{option.desc}}: <input type="text" [(ngModel)]="option.value">
      </div>

      <div class="form-group" *ngIf="option.type=='checkbox'">
        {{option.desc}}: 
        <input type="checkbox" autocomplete="off" [(ngModel)]="option.value">
      </div>

      <div class="form-group" *ngIf="option.type=='colorchart'">
          <colorcharteditor 
                [width]="580"
                [height]="400"
                [originalwidth]="option.width" 
                [originalheight]="option.height" 
                [img]="'/static/thumb/' + option.thumb"
                (coordinates)="option.value = $event;"
              ></colorcharteditor>
      </div>

    </div>
        
  </div>
  <div class="modal-dialog-footer">
        <button [disabled]="working" (click)="onLaunchJob($event)" type="button" class="btn btn-wide btn-apply">Launch
          <i *ngIf="working" class="fa fa-spinner fa-pulse fa-fw"></i>
        </button>
        <button [disabled]="working" (click)="onCancelLaunchJob()" type="button" class="btn btn-wide btn-cancel">Cancel</button>
  </div>
  </div>
</div>
